<template>
  <div class="collect-page">
    <van-nav-bar
  title="收藏列表"
  left-arrow
  @click-left="onClickLeft"
/>
<!-- 扒list -->
<van-list
  v-model="loading"
  :finished="finished"
  finished-text="没有更多了"
  @load="onLoad"
>
 <!-- 封装了单独的商品列表样式在components中  -->
    <Item  v-for="(item,index) in list" :key="index"  :item='item'></Item>

</van-list>

  </div>
</template>

<script>
import Item from '@/components/Item.vue'
import { collectList } from '@/api/user'
export default {
  name: 'collect-page',
  data () {
    return {
      list: [],
      loading: false,
      finished: false
    }
  },
  components: {
    Item
  },
  methods: {
    onClickLeft () {
      this.$router.go(-1)
    },
    // list加载事件
    async onLoad () {
      // 请求数据
      const { body } = await collectList()
      console.log(body)
      // 追加列表
      this.list = body
      // if (this.list.length > body.length) {
      //   this.finished = true
      // }
      this.finished = true
    }
  }
}
</script>

<style>

</style>
